<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>测试应用</title>
    <jsp:include page="common/common_head.jsp"></jsp:include>


</head>
<body  data-spy="scroll" data-target=".navbar">



<jsp:include page="common/common_banner_app.jsp"></jsp:include>
<div style="height:30px"></div>
<div class="container">


    <div class="modal hide fade" id="myModal">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h3>应用信息</h3>
        </div>

        <div class="modal-body">
            <form class="form-horizontal">
                <div class="control-group">
                    <label class="control-label" for="name">名称</label>
                    <div class="controls">
                        <input type="text" id="name" placeholder="名称">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="url">地址</label>
                    <div class="controls">
                        <input type="text" id="url" placeholder="地址">
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="user">执行用户</label>
                    <div class="controls">
                        <input type="text" id="user" >
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">服务器</label>
                    <div class="controls">

                            <c:forEach items="${slave}" var="c">
                                ${c.hostName}  <input type="checkbox" class="allSlave" value="${c.hostName}" id="${c.simpleName}" name="host" /><br/>
                            </c:forEach>

                    </div>
                </div>
                <div class="control-group">
                    <div class="controls" id="host">

                        <button type="submit" class="btn"  id="submitBtn" onclick="processTestConf()">添加</button>
                    </div>
                </div>
            </form>
        </div>

    </div>


    <div style="height: 53px;">
        <a href="#" onclick="showAddConf()" class="btn pull-right btn-primary btn-large">
            <i class="icon-plus icon-white"></i>添加应用</a>

    </div>

	<table class="table  table-striped table-bordered table-hover " id = "showTable">

		<thead>
			<tr>
				<th>序号</th>
				<th>应用名称</th>
                <th>执行用户</th>
                <th>地址</th>
				<th>服务器</th>
				<th>操作</th>

			</tr>
		</thead>
		<tbody>

		<c:forEach items="${result}" var="c" varStatus="v">
			<tr>
				<td>${v.index + 1}</td>
                <td>${c.name}</td>
                <td>${c.user}</td>
                <td>${c.url}</td>
                <td>
                    <select id="select_${v.index + 1}" style="width: 100px">
                        <c:forEach items="${c.hosts()}" var="h">
                            <option value="${h}">${h}</option>
                        </c:forEach>
                    </select>
                </td>
                <td>
                    <a onclick="detail('select_${v.index + 1}', '${c.name}')" class="btn">查看详情</a>
                    <a href="#" onclick="showUpdateConf('${c.name}')" class="btn">更新配置</a>

                </td>
			</tr>
		</c:forEach>

		</tbody>

	</table>



	<jsp:include page="common/common_js.jsp"></jsp:include>



	<script>

        var confAction = "/test/addConf.html";
        ///test/updateConf.html
        function showAddConf(){

            $("#name").val("")
            $("#url").val("")
            $("#user").val("")
            $("#submitBtn").html("添加配置")
            $(".allSlave").attr("checked", false)
            $("#name").attr("disabled", false);

            confAction = "/test/addConf.html";
            $('#myModal').modal({keyboard: true});

        }
        function showUpdateConf(name){


            $.ajax({
                url: "/test/confDetail.html",
                data: {name: name},
                dataType: "json",
                success: function(r){
                    $("#name").val(r.name)
                    $("#url").val(r.url)
                    $("#user").val(r.user)
                    $("#submitBtn").html("更新配置")

                    $(".allSlave").attr("checked", false)
                    $.each(r.host.split(","), function(i, n){

                        var name = r.host.replace(/-|\./g, "")
                        $("#" + name).attr("checked", true)

                    })
                    $("#name").attr("disabled", true);
                    confAction = "/test/updateConf.html";
                    $('#myModal').modal({keyboard: true});

                }
            })
        }
        function detail(id, name){

            location.href = "/test/detail.html?name=test-" + name +"&host=" + $("#" + id).val()
        }
        function checkBox(){
            var allVals = [];
            $('input[name=host]:checked').each(function() {
                allVals.push($(this).val());
            });
            return allVals.join(",")
        }

        function processTestConf(){
            $.ajax({
                url: confAction,
                data: {name: $("#name").val(),user:$("#user").val(), url: $("#url").val(), host:checkBox() },
                dataType: "json",
                success: function(r){

                   // alert(123)
                    if(r.success != true){

                        alert(r.msg)
                    }
                },complete: function(){
                    location.reload();

                    //alert(r1 + "\n" + r2 + "\n" + r3   )
                     }

            })
        }

        $(document).ready(function(){
            $('#url').bind('input', function() {
                var url = $(this).val()
                var start = url.lastIndexOf("/") + 1
                var end = url.lastIndexOf(".git")
                if(start > 0 && end > start){
                    $("#name").val(url.substring(start, end))
                }

            });
        })


	</script>
</body>
</html>